{extend name="common:base" /}


{block name="breadcrumb"}
<h1>
    留言管理
    <small>留言管理</small>
</h1>
<ol class="breadcrumb">
    <li class="active"><a href="{:url('/admin')}"><i class="fa fa-dashboard"></i> 控制台</a></li>
    <li class="active">留言管理</li>
</ol>
{/block}

{block name="search"}
<div class="pad margin no-print">
    <div class="callout callout-info" style="margin-bottom: 0!important;">
        <h4><i class="fa fa-info"></i> Note:</h4>
        这里显示一些用户检索项目。样式需要优化。
    </div>
</div>
{/block}

{block name="content"}
<!-- Default box -->
<div class="box">
    <div class="box-header with-border">
        <h3 class="box-title">留言列表</h3>


    </div>
    <!-- /.box-header -->
    <div class="box-body">
        <table class="table table-striped">
            <tr>
                <th style="width: 10px">#</th>
                <th>主题</th>
                <th>联系人</th>
                <th>电话</th>
                <th>备注</th>
                <th style="width: 230px;">操作</th>
            </tr>
            {volist name='list' id='vo'}
            <tr>
                <td>{$vo.id}.</td>
                <td>{$vo.title}</td>
                <td>{$vo.name}</td>
                <td>{$vo.tel}</td>
                <td>{$vo.remark}</td>
                <td>
                    <a href="javascript:;" class="btn btn-sm bg-olive btn-flat btn-show" data-json='{:json_encode($vo,true)}'><i class="fa fa-eye"></i> 详情</a>
                    {if($vo.remark != '')}
                    <a href="#" class="btn btn-sm btn-default btn-flat" readonly="true"> 已备注</a>
                    {else /}
                    <a href="#" class="btn btn-sm bg-olive btn-flat btn-prompt" data-id="{$vo.id}"><i class="fa fa-pencil"></i> 备注</a>
                    {/if}

                    <a href="javascript:;" class="btn btn-sm bg-maroon btn-flat ajax-delete" data-url="{:url('/admin/message_board/delete')}" data-id="{$vo.id}">
                        <i class="fa fa-trash"></i> 删除
                    </a>
                </td>
            </tr>
            {/volist}

        </table>
    </div>
    <!-- /.box-body -->
    <div class="box-footer clearfix">
        <!--<ul class="pagination pagination-sm no-margin pull-right">分页</ul>-->
        {$list->render()}
    </div>
</div>
<!-- /.box -->
{/block}
{block name="js"}
<script>
    $('.btn-prompt').click(function () {
        var id = $(this).attr('data-id');
        layer.prompt({title: '填写备注，并确认', formType: 2}, function(text, index){

            $.post('{:url("/admin/message_board/remark")}',{id:id,remark:text},function (res) {
                if (res.code == 1){
                    layer.close(index);
                    layer.msg('备注成功');
                    window.location.reload();
                }else{
                    layer.msg(res.msg);
                }
            });
        });
    });
    $('.btn-show').click(function () {
        var jsonStr = $(this).attr('data-json');
        var json = JSON.parse(jsonStr);
        // console.log(json);
        layer.open({
            type: 1,
            skin: 'layui-layer-rim', //加上边框
            area: ['420px', '240px'], //宽高
            content: '<div style="padding:20px;">' +
            '主题：' + json.title + '<br>' +
            '内容：' + json.content + '<br>' +
            '联系人：' + json.name + '<br>' +
            '电话：' + json.tel + '<br>' +
            '邮箱：' + json.email + '<br>' +
            '地址：' + json.address + '<br>' +
            '备注：' + json.remark + '<br>' +
            '</div>'
        });
    });


</script>
{/block}